<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8">
    <title>2017.4.24 router</title>
    <script src="./vue.js"></script>
    <script src="./vue-router.js"></script>
</head>

<body>
    <div id="app">
        <p v-if="seen">{{value | sum}}</p>
        <ul>
         
        </ul>

    </div>
    <!--<script>
        //组件需要先进行注册 如果这个组件放在Vue后面的话 浏览器会报错
        Vue.component('first',{
            template:'<li>{{todo.text}}</li>',
            props:['todo']
        })
        var app = new Vue({
            el: '#app',
            data: {
                seen: true,
                message: '隐藏',
                msg: '我是可以根据输入框变化的',
                arr: [{
                        text: '蔬菜'
                    },
                    {
                        text: '奶酪'
                    },
                    {
                        text: '随便其他什么人吃的东西'
                    }
                ]
            },
            methods: {
                toggle: function () {
                    if (this.seen) {
                        this.seen = false;
                        this.message = '显示'
                    } else {
                        this.seen = true;
                        this.message = '隐藏'
                    }
                },
                toggle2: function () {
                    this.seen = !this.seen
                }
            }
        });
        // 定义名为 todo-item 的新组件
    </script>-->
    <script>
        Vue.filter('sum',function(value){
            return value+100
        })
        var app = new Vue({
            el: '#app',
            data: {
                a: 1,
                seen: true,
                arr:[1,10,100,1000,10000],
                value:2
            },
            filter:{
                odd:function(value){
                    if(value<1000){
                        return value
                    }
                }
            }
        })
    </script>
</body>

</html>